<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>1-发ajax请求</title>
</head>

<body>
    <button id="getBtn">GET AJAX</button>
    <button id="postBtn">POST AJAX</button>
    <button id="putBtn">PUT AJAX</button>
    <button id="deleteBtn">Delete AJAX</button>

    <script>
        const getBtn = document.getElementById('getBtn')
        const postBtn = document.getElementById('postBtn')
        const putBtn = document.getElementById('putBtn')
        const deleteBtn = document.getElementById('deleteBtn')

        // 发送get请求
        getBtn.onclick = () => {
            const xhr = new XMLHttpRequest() 
            xhr.open('GET', 'http://localhost:8081/server/2?name=tom&age=11', true)
            xhr.send()
        }
        // 发送post请求
        postBtn.onclick = () => {
            const xhr = new XMLHttpRequest() 
            xhr.open('POST', 'http://localhost:8081/server/2?name=tom&age=12', true)
            xhr.send()
        }
        // 发送put请求
        putBtn.onclick = () => {
            const xhr = new XMLHttpRequest() 
            xhr.open('PUT', 'http://localhost:8081/server/2?name=tom&age=13', true)
            xhr.send()
        }
        // 发送delete请求
        deleteBtn.onclick = () => {
            const xhr = new XMLHttpRequest() 
            xhr.open('DELETE', 'http://localhost:8081/server/2?name=tom&age=14', true)
            xhr.send()
        }






    </script>
</body>

</html>